<template>
    <div class="index">
        <!-- 库存详情 -->
        <div class="detail">
            <h2>库存详情</h2>
            <el-descriptions title="" :column="3" :border='true' class="tab" :contentStyle="CS">
                <el-descriptions-item label="产品名称">{{ result.name }}</el-descriptions-item>
                <el-descriptions-item label="规格">{{ result.specification }}</el-descriptions-item>
                <el-descriptions-item label="单位">{{ result.uomName }}</el-descriptions-item>
                <el-descriptions-item label="体积">{{ result.volume }}</el-descriptions-item>
                <el-descriptions-item label="重量">{{ result.weight }}</el-descriptions-item>
                <!-- <el-descriptions-item label="售价">{{ result.listPrice }}</el-descriptions-item> -->
                <el-descriptions-item label="颜色">{{ result.color }}</el-descriptions-item>
                <el-descriptions-item label="实际数量">{{ result2.quantity }}</el-descriptions-item>
                <el-descriptions-item label="可操作数量">{{ result2.operationalQuantity }}</el-descriptions-item>
                <el-descriptions-item label="预测数量">{{ result2.predictiveQuantity }}</el-descriptions-item>
                <el-descriptions-item label="可用于销售">{{ result.saleOk === 't' ? '是' : '否' }}</el-descriptions-item>
                <el-descriptions-item label="可用于购买">{{ result.purchaseOk === 't' ? '是' : '否' }}</el-descriptions-item>
                <el-descriptions-item label="可用于费用">{{ result.canBeExpensed === 't' ? '是' : '否' }}</el-descriptions-item>
                <el-descriptions-item label="类型">{{ result.type }}</el-descriptions-item>
                <el-descriptions-item label="内部类别">{{ result.categName }}</el-descriptions-item>
                <!-- <el-descriptions-item label="序列">{{ result.sequence }}</el-descriptions-item> -->
                <!-- <el-descriptions-item label="Active">{{ result.active }}</el-descriptions-item> -->
                <el-descriptions-item label="创建者">{{ result.createUserName }}</el-descriptions-item>
                <el-descriptions-item label="创建日期">{{ result.createDate }}</el-descriptions-item>
                <el-descriptions-item label="最后更新者">{{ result.writeUserName }}</el-descriptions-item>
                <el-descriptions-item label="最后更新日期">{{ result.writeDate }}</el-descriptions-item>
                <!-- <el-descriptions-item label="仓库(海内外)">{{ result.warehouse }}</el-descriptions-item> -->
                <el-descriptions-item label="库存描述">{{ result.description }}</el-descriptions-item>
                <el-descriptions-item label="采购描述">{{ result.descriptionPurchase }}</el-descriptions-item>
                <el-descriptions-item label="销售描述">{{ result.descriptionSale }}</el-descriptions-item>
            </el-descriptions>
        </div>
        <!-- 重订货规则 -->
        <!-- <div class="product">
            <h2>重订货规则</h2>
            <div class="btn">
                <el-button type="primary" icon="el-icon-plus" size="mini" @click="addReorder">新增重订货规则</el-button>
            </div>
            <el-table :data="tableData8" style="width: 90%; margin: 5px auto 30px;" border>
                <el-table-column prop="name" label="产品名称">
                </el-table-column>
                <el-table-column prop="productMinQty" label="缺货预警数量">
                </el-table-column>
                <el-table-column prop="productMaxQty" label="补货推荐数量">
                </el-table-column>
                <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
                    <template slot-scope="scope">
                        <el-button size="mini" type="text" icon="el-icon-edit" @click="ReorderUpdate(scope.row)"
                            v-hasPermi="['system:stock:edit']">修改</el-button>
                        <el-button size="mini" type="text" icon="el-icon-delete" @click="ReorderDel(scope.row)"
                            v-hasPermi="['system:stock:delete']">删除</el-button>
                    </template>
                </el-table-column>

            </el-table>
        </div> -->
        <!-- 重订货规则新增或修改对话框 -->
        <!-- <el-dialog :title="title" :visible.sync="reorderadd" width="800px" append-to-body>
            <el-form ref="form1" :model="form1" :rules="rules1" label-width="150px">
                <el-form-item label="库存预警数量" prop="productMinQty">
                    <el-input v-model.number="form1.productMinQty" placeholder="请输入库存预警数量" />
                </el-form-item>
                <el-form-item label="补货推荐数量" prop="productMaxQty">
                    <el-input v-model.number="form1.productMaxQty" placeholder="请输入补货推荐数量"></el-input>
                </el-form-item>

            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button type="primary" @click="submitForm1">确 定</el-button>
                <el-button @click="cancel">取 消</el-button>
            </div>
        </el-dialog> -->

        <div class="show">
            <el-button v-hasRole="['sale', 'purchase']" type="text" @click="cgisshow">{{ cgbtn }}<i
                    :class="isExpandedcg"></i></el-button>
        </div>

        <!-- 采购历史 -->
        <transition name="draw">
            <div class="product" v-show="cgshow">
                <h2>采购历史</h2>
                <el-table :data="tableData4" style="width: 90%; margin: 5px auto 30px;" border max-height="450"
                    :header-cell-style="{ 'text-align': 'center' }" :cell-style="{ 'text-align': 'center' }">
                    <el-table-column prop="orderDisplayName" label="采购订单名称">
                        <template slot-scope="scope">
                            <div @click="alertPur(scope.row)">
                                <a href="javascript:;">{{ scope.row.orderDisplayName }}</a>
                            </div>
                        </template>
                    </el-table-column>
                    <el-table-column prop="partnerDisplayName" label="供应商名称">
                    </el-table-column>
                    <el-table-column prop="productQty" label="采购数量">
                    </el-table-column>
                    <!-- <el-table-column prop="priceUnit" label="单价（元）">
                </el-table-column> -->
                    <!-- <el-table-column prop="priceTotal " label=" 该产品总价（元）">
                </el-table-column> -->
                </el-table>
            </div>
        </transition>

        <div class="show">
            <el-button v-hasRole="['purchase', 'stock']" type="text" @click="xsisshow">{{ xsbtn }} <i
                    :class="isExpandedxs"></i></el-button>
        </div>
        <!-- 销售历史 -->
        <transition name="draw">
            <div class="product" v-show="xsshow">
                <h2>销售历史</h2>
                <el-table :data="tableData5" style="width: 90%; margin: 5px auto 30px;" border max-height="450"
                    :header-cell-style="{ 'text-align': 'center' }" :cell-style="{ 'text-align': 'center' }">
                    <el-table-column prop="orderDisplayName" label="销售订单名称">
                        <template slot-scope="scope">
                            <div @click="alertSale(scope.row)">
                                <a href="javascript:;">{{ scope.row.orderDisplayName }}</a>
                            </div>
                        </template>
                    </el-table-column>
                    <el-table-column prop="orderPartnerDisplayName" label="客户名称">
                    </el-table-column>
                    <!-- <el-table-column prop="priceUnit" label="产品单价">
                </el-table-column> -->
                    <el-table-column prop="productUomQty" label="销售数量">
                    </el-table-column>
                    <!-- <el-table-column prop="priceSubtotal " label=" 总价">
                </el-table-column> -->
                </el-table>
            </div>
        </transition>
        <div class="show">
            <el-button v-hasRole="['sale', 'purchase', 'stock']" type="text" @click="bomisshow">{{ bombtn }}<i
                    :class="isExpandedbom"></i></el-button>
        </div>
        <!-- 物料清单 -->
        <transition name="draw">
            <div class="product" v-show="bomshow">
                <h2>物料清单</h2>
                <!-- <div class="btn">
                <el-button type="primary" icon="el-icon-plus" size="mini" @click="addBom">新增物料清单</el-button>
            </div> -->
                <el-table :data="tableData6" style="width: 90%; margin: 5px auto 30px;" border max-height="450"
                    :header-cell-style="{ 'text-align': 'center' }" :cell-style="{ 'text-align': 'center' }">
                    <el-table-column prop="displayName" label="组件名称">
                        <template slot-scope="scope">
                            <div @click="stockdetail(scope.row)">
                                <a href="javascript:;">{{ scope.row.displayName }}</a>
                            </div>
                        </template>
                    </el-table-column>
                    <el-table-column prop="productUomName" label="单位">
                    </el-table-column>
                    <el-table-column prop="productQty" label="组件需求数量">
                    </el-table-column>

                    <el-table-column prop="stockNum" label="产品实际库存">
                    </el-table-column>
                    <!-- <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
                    <template slot-scope="scope">
                        <el-button size="mini" type="text" icon="el-icon-delete" @click="BomDelete(scope.row)"
                            v-hasPermi="['system:stock:remove']">删除</el-button>
                    </template>
                </el-table-column> -->
                </el-table>
            </div>
        </transition>
        <!-- 物料清单新增对话框 -->
        <el-dialog :title="title" :visible.sync="Bomadd" width="800px" append-to-body>
            <el-form ref="Bomform" :model="Bomform" :rules="Bomrules" label-width="150px">
                <!-- <el-form-item label="库存产品id" prop="stockId">
                    <el-input v-model.number="Bomform.stockId" placeholder="请输入最低采购数量" />
                </el-form-item> -->
                <el-form-item label="物料清单组件" prop="productTemplateId">
                    <!-- <el-input v-model.number="Bomform.productTemplateId" placeholder="请输入最低采购数量" /> -->
                    <el-select v-model="Bomform.productTemplateId" filterable placeholder="请选择产品"
                        :filter-method="stockfilterMethod">
                        <el-option v-for="item in stockdata" :key="item.id" :label="item.name" :value="item.id">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="添加数量" prop="productQty">
                    <el-input v-model.number="Bomform.productQty" placeholder="请输入添加数量"></el-input>
                </el-form-item>

            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button type="primary" @click="Bomsub">确 定</el-button>
                <el-button @click="cancel">取 消</el-button>
            </div>
        </el-dialog>
        <div class="show">
            <el-button v-hasRole="['purchase', 'stock']" type="text" @click="bhbomisshow">{{ bhbombtn }}<i
                    :class="isExpandedbhbom"></i></el-button>
        </div>
        <!-- 包含该产品的物料清单 -->
        <transition name="draw">
            <div class="product" v-show="bhbomshow">
                <h2>用于的物料清单</h2>
                <el-table :data="tableData7" style="width: 90%; margin: 5px auto 30px;" border max-height="450"
                    :header-cell-style="{ 'text-align': 'center' }" :cell-style="{ 'text-align': 'center' }">
                    <el-table-column prop="productTmplName" label="bom名称">
                        <template slot-scope="scope">
                            <div @click="stockdetail(scope.row)">
                                <a href="javascript:;">{{ scope.row.productTmplName }}</a>
                            </div>
                        </template>
                    </el-table-column>
                    <el-table-column prop="productUomName" label="单位">
                    </el-table-column>
                    <el-table-column prop="productQty" label="用于数量">
                    </el-table-column>

                    <el-table-column prop="bomPartNumInBom" label="该产品当前库存实际数量">
                    </el-table-column>


                </el-table>
            </div>
        </transition>
        <div class="show">
            <el-button type="text" @click="czisshow">{{ czbtn }}<i :class="isExpandedcz"></i></el-button>
        </div>
        <!-- 操作记录 -->
        <transition name="draw">
            <div class="product" v-show="czshow">
                <h2>操作记录</h2>
                <el-table :data="tableData2" style="width: 90%;margin: 5px auto 30px;" border max-height="350"
                    :header-cell-style="{ 'text-align': 'center' }" :cell-style="{ 'text-align': 'center' }">


                    <el-table-column prop="handleMan" label="操作人">
                    </el-table-column>
                    <el-table-column prop="handleType" label="操作类型">
                    </el-table-column>
                    <el-table-column prop="recordTime" label="操作时间">
                    </el-table-column>
                    <el-table-column prop="handleNum" label="操作数量">
                    </el-table-column>
                    <el-table-column prop="stockMsg" label="操作信息">
                    </el-table-column>

                </el-table>
            </div>
        </transition>
        <!-- 打开采购订单详情弹框 -->
        <div v-if="openPurCD">
            <el-dialog :visible.sync="openPurOrder" width="1500px" append-to-body @close='closeDialog'>
                <Purchasedetail :fid="partnerIdP"></Purchasedetail>
            </el-dialog>
        </div>
        <!-- 打开销售订单详情弹框 -->
        <div v-if="openSaleCD">
            <el-dialog :visible.sync="openSaleOrder" width="1500px" append-to-body @close='closeDialog'>
                <Saleorderdetail :fid="partnerIdS"></Saleorderdetail>
            </el-dialog>
        </div>
        <!-- 库存详情弹框 -->
        <div v-if="showStockCD">
            <el-dialog :visible.sync="openStock" width="1500px" append-to-body :destroy-on-colse="true"
                @close='closeDialog'>
                <Stockdetail :fid="stockid"></Stockdetail>
            </el-dialog>
        </div>
    </div>
</template>
<script>
import {
    getSupplierinfo, getStock, getPurchaseHty, getSaleHty, getStkBomPart, getOperationdetailsAPI, getReorderRules, getStkBomBlt, getsupplieradd
    , getsupplierdel, getreorderadd, getreorderupdate, addBomPart, listStock, delBomPart, getreorderDel, getnum
} from "@/api/system/stock";
import Purchasedetail from '@/views/system/purchasedetail/index'
import Saleorderdetail from '@/views/system/saleorderdetail/index'
import Stockdetail from '@/views/system/stockdetail/index'
export default {
    data() {
        return {
            // 是否显示弹框，用来解决第二次弹框组件内容没变化的问题
            showStockCD: true,
            // 传给库存详情页的id
            stockid: null,
            // 库存详情弹框
            openStock: false,
            // 销售订单详情弹框创建和销毁
            openSaleCD: false,
            //销售订单的弹框
            openSaleOrder: false,
            // 销售订单详情参数
            partnerIdS: null,
            // 采购订单详情弹框创建和销毁
            openPurCD: false,
            //采购订单的弹框
            openPurOrder: false,
            // 采购订单详情参数
            partnerIdP: null,
            // 采购图标
            isExpandedcg: 'el-icon-caret-right',
            // 销售图标
            isExpandedxs: 'el-icon-caret-right',
            // 物料清单图标
            isExpandedbom: 'el-icon-caret-right',
            // 包含物料清单图标
            isExpandedbhbom: 'el-icon-caret-right',
            // 操作记录图标
            isExpandedcz: 'el-icon-caret-right',
            // 采购历史是否折叠
            cgshow: false,
            // 采购历史按钮
            cgbtn: '展开采购历史',
            // 销售历史是否折叠
            xsshow: false,
            // 销售历史按钮
            xsbtn: '展开销售历史',
            // 物料清单是否折叠
            bomshow: false,
            // 物料清单按钮
            bombtn: '展开物料清单',
            // 包含物料清单是否折叠
            bhbomshow: false,
            // 包含物料清单按钮
            bhbombtn: '展开包含物料清单',
            // 采购历史是否折叠
            czshow: false,
            // 操作记录按钮
            czbtn: '展开操作记录',

            // 列表描述单元格的样式
            CS: {
                //   'text-align': 'center',  //文本居中
                'max-width': '280px',   //最小宽度
                'word-break': 'break-all'  //过长时自动换行
            },
            // 库存详情
            result: {},
            // 库存数量
            result2: {},
            // 操作记录
            tableData2: [],
            // 采购历史
            tableData4: [],
            // 销售历史
            tableData5: [],
            // 物料清单
            tableData6: [],
            // 包含该产品的物料清单
            tableData7: [],
            // 重订货规则
            tableData8: [],
            // 重订货规则弹框
            reorderadd: false,
            // 重订货规则参数
            form1: {},
            // 新增修改重订货规则表单校验
            rules1: {
                productMinQty: [{ required: true, message: '库存预警数量不能为空' },
                { type: 'number', message: '库存预警数量只能输入整数', trigger: 'blur' }

                ],
                productMaxQty: [
                    { required: true, message: "补充推荐数量不能为空", trigger: "blur" },
                    { pattern: /^[+]{0,1}(\d+)$/, message: "补充推荐数量只能输入正整数", trigger: "blur" }
                ],
                // name: [
                //     { required: true, message: "产品名称不能为空", trigger: "blur" }
                // ]


            },
            // 弹框标题
            title: '',
            // 物料清单新增参数
            Bomform: {},
            // 新增物料清单弹框
            Bomadd: false,
            // 查询参数
            stockquery: {
                pageNum: null,
                pageSize: null,
                name: null,
                sequence: null,
                description: null,
                descriptionPurchase: null,
                descriptionSale: null,
                type: null,
                categId: null,
                listPrice: null,
                volume: null,
                weight: null,
                saleOk: null,
                purchaseOk: null,
                uomId: null,
                active: null,
                color: null,
                createUid: null,
                createDate: null,
                writeUid: null,
                writeDate: null,
                specification: null,
                canBeExpensed: null,
                warehouse: null
            },
            stockdata: [],
            Bomrules: {
                productQty: [{ required: true, message: '数量不能为空' },
                { type: 'number', message: '库存预警数量只能输入整数', trigger: 'blur' }

                ],
                productTemplateId: [
                    { required: true, message: "产品不能为空", trigger: "blur" }
                ]


            },

        };
    },
    mounted() {
        // 通过$route.query将传过来的值接收;
        let id = this.fid || this.$route.query.listId;
        this.getList(id);
        this.getdetail(id);
        this.getReorderRules(id)

        this.getPurchaseHty(id)
        this.getSaleHty(id)
        this.getStkBomPart(id)
        this.getStkBomBlt(id)

        this.stockList()
    },
    methods: {

        // 采购历史折叠
        cgisshow() {
            this.cgshow = !this.cgshow
            if (this.cgshow) {
                this.isExpandedcg = 'el-icon-caret-bottom';
                this.cgbtn = '收起采购历史'
            } else {
                this.isExpandedcg = 'el-icon-caret-right';
                this.cgbtn = '展开采购历史'
            }

        },
        // 销售历史折叠
        xsisshow() {
            this.xsshow = !this.xsshow
            if (this.xsshow) {
                this.isExpandedxs = 'el-icon-caret-bottom';
                this.xsbtn = '收起销售历史'
            } else {
                this.isExpandedxs = 'el-icon-caret-right';
                this.xsbtn = '展开销售历史'
            }

        },
        // 物料清单折叠
        bomisshow() {
            this.bomshow = !this.bomshow
            if (this.bomshow) {
                this.isExpandedbom = 'el-icon-caret-bottom';
                this.bombtn = '收起物料清单'
            } else {
                this.isExpandedbom = 'el-icon-caret-right';
                this.bombtn = '展开物料清单'
            }

        },
        // 包含物料清单折叠
        bhbomisshow() {
            this.bhbomshow = !this.bhbomshow
            if (this.bhbomshow) {
                this.isExpandedbhbom = 'el-icon-caret-bottom';
                this.bhbombtn = '收起包含物料清单'
            } else {
                this.isExpandedbhbom = 'el-icon-caret-right';
                this.bhbombtn = '展开包含物料清单'
            }

        },
        // 操作记录折叠
        czisshow() {
            this.czshow = !this.czshow
            if (this.czshow) {
                this.isExpandedcz = 'el-icon-caret-bottom';
                this.czbtn = '收起操作记录'
            } else {
                this.isExpandedcz = 'el-icon-caret-right';
                this.czbtn = '展开操作记录'
            }

        },
        // 取消按钮
        cancel() {
            this.supplieradd = false;
            this.reorderadd = false;
            this.Bomadd = false;
            //   this.reset();
        },

        // 库存详情
        getList(id) {
            getStock(id).then(res => {
                // console.log(res);
                this.result = res.data
                // console.log(this.result);
            })
            getnum(id).then(res => {
                // console.log(res);
                this.result2 = res.data
            })
        },

        // 操作详情
        getdetail(id) {

            getOperationdetailsAPI(id).then(response => {
                // console.log(response);
                this.tableData2 = response.data;
            });

        },
        // 重订货规则重置
        reset() {
            this.form1 = {
                partnerId: null,
                productMinQty: null,
                productMaxQty: null,
            };
            this.resetForm("form1");
        },
        // 重订货规则
        getReorderRules(id) {
            getReorderRules(id).then(res => {
                // console.log(res);
                // console.log(res.data[0]);
                if (res.data != undefined)
                    this.tableData8 = res.data
            })
        },
        // 重订货规则新增弹框
        addReorder() {
            // console.log(id);
            this.title = '新增该产品重订货规则'
            this.reorderadd = true
            this.reset()
            this.form1.stockId = Number(this.$route.query.listId)
        },
        // 重订货规则修改弹框
        ReorderUpdate(row) {
            // console.log(row);
            //   this.reset();
            const id = row.productId
            // console.log(id)
            getReorderRules(id).then(response => {
                // console.log(response);
                this.form1 = response.data[0];
                this.reorderadd = true;
                this.title = "修改重订货规则";
            });
        },
        // 重订货规则新增或修改确认
        submitForm1() {
            // console.log(this.form1);
            this.$refs["form1"].validate(valid => {
                if (valid) {
                    // console.log(this.form1.productId);
                    // console.log(this.form1);

                    if (this.form1.partnerId !== null) {
                        const que = {
                            stockId: Number(this.$route.query.listId),
                            productMinQty: this.form1.productMinQty,
                            productMaxQty: this.form1.productMaxQty,
                        }
                        // console.log(que);
                        getreorderupdate(que).then(response => {
                            this.$modal.msgSuccess("修改成功");
                            this.reorderadd = false;
                            this.getReorderRules(this.form1.productId)
                        });
                    } else {
                        getreorderadd(this.form1).then(response => {
                            this.$modal.msgSuccess("新增成功");
                            this.reorderadd = false;
                            //   this.getList();
                            this.getReorderRules(this.form1.stockId)
                        });
                    }
                }
            });
        },
        // 重订货规则删除
        ReorderDel(row) {
            const id = this.$route.query.listId;
            // console.log(row);
            this.$modal.confirm('是否确认删除重订货规则为"' + row.name + '的数据项？').then(function () {
                return getreorderDel(id);
            }).then(() => {
                // this.getList();
                this.getReorderRules(id)
                this.$modal.msgSuccess("删除成功");
            }).catch(() => { });

        },
        //采购历史详情
        getPurchaseHty(id) {
            getPurchaseHty(id).then(res => {
                // console.log(res);
                this.tableData4 = res.data
            })
        },
        // 销售历史
        getSaleHty(id) {
            getSaleHty(id).then(res => {
                // console.log(res);
                this.tableData5 = res.data
                // console.log(this.tableData5);
            })
        },
        //物料清单
        getStkBomPart(id) {
            getStkBomPart(id).then(res => {
                // console.log(res);
                this.tableData6 = res.data
                // console.log(this.tableData6);
            })
        },
        // 新增物料清单弹框
        addBom() {
            // console.log(id);
            this.title = '新增该产品的物料清单'
            this.Bomadd = true
            this.Bomform.stockId = Number(this.$route.query.listId)
        },
        // 下拉框选择产品组件,用于下拉框显示默认十条
        stockList() {
            listStock(this.stockquery).then(res => {
                // console.log(res);
                this.stockdata = res.rows
                // console.log(this.stockdata);

            })
        },
        // 产品搜索，用于直接在下拉框搜索
        stockfilterMethod(node, val) {
            const que = {
                name: node,
                pageSize: 100
            }
            // console.log(que);
            listStock(que).then(res => {
                // console.log(res);
                this.stockdata = res.rows
            })
        },
        // 产品组件新增提交
        Bomsub() {
            this.Bomform.stockId = this.$route.query.listId;
            this.Bomform.productQty = Number(this.Bomform.productQty)
            // console.log(this.Bomform);
            this.$refs["Bomform"].validate(valid => {
                if (valid) {
                    //   if (this.form.id != null) {
                    //     updateStock(this.form).then(response => {
                    //       this.$modal.msgSuccess("修改成功");
                    //       this.open = false;
                    //       this.getList();
                    //     });
                    //   } else {
                    addBomPart(this.Bomform).then(response => {
                        this.$modal.msgSuccess("新增成功");
                        this.Bomadd = false;
                        //   this.getList();
                        this.getStkBomPart(this.Bomform.stockId)
                    });
                    //   }
                }
            });
        },
        // 物料清单删除
        BomDelete(row) {
            // console.log(row);
            const id = row.id
            const stockid = this.$route.query.listId
            // console.log(id);
            this.$modal.confirm('是否确认删除产品名称为' + row.displayName + '的物料清单吗？').then(function () {
                return delBomPart(id);
            }).then(() => {
                // this.getList();
                this.getStkBomPart(stockid)
                this.$modal.msgSuccess("删除成功");
            }).catch(() => { });

        },
        // 包含该产品的物料清单
        getStkBomBlt(id) {
            getStkBomBlt(id).then(res => {
                // console.log(res);
                this.tableData7 = res.data
                // console.log(this.tableData6);
            })
        },
        // 关闭弹框的时候销毁内容  再次点击重新创建
        closeDialog() {
            this.openPurCD = false
            this.openSaleCD = false
            this.showStockCD = false
        },
        // 点击采购订单打开详情
        alertPur(row) {
            // console.log(row);
            this.openPurCD = true
            this.partnerIdP = row.orderId
            this.openPurOrder = true
        },
        // 点击采购订单打开详情
        alertSale(row) {
            // console.log(row);
            this.openSaleCD = true
            this.partnerIdS = row.orderId
            this.openSaleOrder = true
        },
        // 点击产品名称弹出详情
        stockdetail(row) {
            // console.log(row)
            this.showStockCD = true
            this.stockid = row.productTemplateId
            this.openStock = true

        },

    },
    components: {
        Purchasedetail,
        Saleorderdetail,
        Stockdetail: () => import('@/views/system/stockdetail/index.vue')

    },
    props: {
        fid: {
            type: Number, default: null
        }
    },
    watch: {},
    computed: {},
    created() { },
};
</script>
<style lang="scss"  scoped>
// * {
//     margin: 0;
//     padding: 0;
// }
.show {
    // border: 1px red solid;
    width: 80%;
    text-align: left;
    margin: 10px auto;

    .el-button--text {
        color: #1f1e1e;
    }

}

.index {
    // background: #f9f9f9;
    border: 1px transparent solid;


}

h2 {
    text-align: center;
    line-height: 60px;
}


.detail {
    background: #fff;
    border: 1px rgb(232, 228, 228) solid;
    // box-shadow: 0 3px 20px -15px #000000;
    box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
    margin: 10px auto;
    width: 80%;



    .line {
        margin: 30px auto;
        // border: 1px rgb(224, 17, 17) solid;
        padding: 10px;
        height: 20px;
    }



}

.tab {
    width: 90%;
    margin: 10px auto 30px;
}

.product {
    width: 80%;
    background: #fff;
    border: 1px rgb(232, 228, 228) solid;
    // box-shadow: 0 3px 20px -15px #000000;
    box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
    margin: 10px auto;
}

.my-content {
    background: #1f1e1e;
}


::v-deep .el-descriptions-item__label.is-bordered-label {
    font-weight: bold;
    color: #6d6a6a;
    background: #f8f8f9;
}

.btn {
    margin-left: 5%;
}


.draw-enter-active {
    transition: all 2s;
}

.draw-leave-active {
    transition: all 0.1s;
}

.draw-enter,
.draw-leave-to

/* .fade-leave-active below version 2.1.8 */
    {
    height: 0;
    opacity: 0;
}
</style>